<template>
  <div>
    <el-cascader
      expand-trigger="hover"
      :options="options"
      @change="handleChange"
    ></el-cascader>
  </div>
</template>

<script>
export default {
  props: {
    options: {
      type: Array,
      default: () => [
        {
          value: 'shuizhi',
          label: '水质',
          children: [
            {
              value: 'dixiashui',
              label: '地下水'
            },
            {
              value: 'haishui',
              label: '海水'
            },
            {
              value: 'feishui',
              label: '废水'
            },
            {
              value: 'dibiaoshui',
              label: '地表水'
            }
          ]
        },
        {
          value: 'kongqi',
          label: '空气',
          children: [
            {
              value: 'wuzuzhifeiqi',
              label: '无组织废气'
            },
            {
              value: 'huanjingkongqi',
              label: '环境空气'
            },
            {
              value: 'shineikongqi',
              label: '室内空气'
            }
          ]
        },
        {
          value: 'feiqi',
          label: '废气',
          children: [
            {
              value: 'youzuzhi',
              label: '有组织废气'
            }
          ]
        },
        {
          value: 'jiangshui',
          label: '降水',
          children: [
            {
              value: 'jiangshui1',
              label: '降水'
            }
          ]
        },
        {
          value: 'gufei',
          label: '固废',
          children: [
            {
              value: 'gufei',
              label: '固废'
            }
          ]
        },
        {
          value: 'turang',
          label: '土壤',
          children: [
            {
              value: 'turang',
              label: '土壤'
            }
          ]
        },
        {
          value: 'zaosheng',
          label: '噪声',
          children: [
            {
              value: 'dixiashui',
              label: '区域噪声'
            },
            {
              value: 'haishui',
              label: '结构传播固定设备噪声'
            },
            {
              value: 'feishui',
              label: '道路交通噪声'
            },
            {
              value: 'dibiaoshui',
              label: '功能区噪声'
            },
            {
              value: 'dibiaoshui',
              label: '社会生活环境噪声'
            },
            {
              value: 'dibiaoshui',
              label: '建筑施工工厂界噪声'
            },
            {
              value: 'dibiaoshui',
              label: '机场周围飞机噪声'
            },
            {
              value: 'dibiaoshui',
              label: '厂界噪声'
            }
          ]
        },
        {
          value: 'zhendong',
          label: '震动',
          children: [
            {
              value: 'zhendong',
              label: '震动'
            }
          ]
        },
        {
          value: 'fushe',
          label: '辐射',
          children: [
            {
              value: 'fushe',
              label: '辐射'
            }
          ]
        },
        {
          value: 'meijie',
          label: '媒介',
          children: [
            {
              value: 'meijie',
              label: '媒介'
            }
          ]
        }
      ]
    }
  },
  methods: {
    handleChange (value) {
      // console.log(value)
      this.$emit('handleChange', value, value)
    }
  }
}
</script>

<style lang="stylus">
.el-cascader
  width 100%
// .el-cascader-menu
</style>
